From 65c1075b869d16b31f4479f3d7025804f9cf08b7 Mon Sep 17 00:00:00 2001 From: =?utf8?q?D=C3=A1vid=20Benko?= Date: Sat, 23 Aug 2025 18:00:33 +0200 Subject: [PATCH] themes: scale down icons for network interfaces MIME-Version: 1.0 Content-Type: text/plain; charset=utf8 Content-Transfer-Encoding: 8bit Many LuCI icons doubled in size during migration to vector graphics in commit ae5d91da903b6f1d3086d6082ca622231e34f555 (16px to 32px). Sizing of their instances is mostly controlled by CSS, but there's an exception - network interface boxes of "Interfaces" page in LuCI. Current CSS doesn't specify any particular size requirements to follow, so the icons just scale with the images served, thus effectively doubling in width and height compared to state before the vectorization commit. Such a big icons look odd and take up too much space, especially for bridge interfaces with many ports. Instead of reverting to the original 16×16px, this commit proposes compromise of 24×24px as most of other icons within LuCI became a bit bigger as well. Signed-off-by: Dávid Benko --- .../htdocs/luci-static/bootstrap/cascade.css | 5 +++++ .../htdocs/luci-static/material/cascade.css | 5 +++++ .../htdocs/luci-static/openwrt2020/cascade.css | 5 +++++ .../htdocs/luci-static/openwrt.org/cascade.css | 5 +++++ 4 files changed, 20 insertions(+) diff --git a/themes/luci-theme-bootstrap/htdocs/luci-static/bootstrap/cascade.css b/themes/luci-theme-bootstrap/htdocs/luci-static/bootstrap/cascade.css index 8ab413f11f..6ab19035ce 100644 --- a/themes/luci-theme-bootstrap/htdocs/luci-static/bootstrap/cascade.css +++ b/themes/luci-theme-bootstrap/htdocs/luci-static/bootstrap/cascade.css @@ -2188,6 +2188,11 @@ th[data-sort-direction="desc"]::after { content: "\a0\25bc"; } white-space: normal; } +#cbi-network-interface .ifacebox img { + width: 24px; + height: 24px; +} + .ifacebadge { display: inline-block; flex-direction: row; diff --git a/themes/luci-theme-material/htdocs/luci-static/material/cascade.css b/themes/luci-theme-material/htdocs/luci-static/material/cascade.css index d100a06442..338d7b4fb3 100644 --- a/themes/luci-theme-material/htdocs/luci-static/material/cascade.css +++ b/themes/luci-theme-material/htdocs/luci-static/material/cascade.css @@ -2084,6 +2084,11 @@ td > .ifacebadge, padding: .25em; } +#cbi-network-interface .ifacebox img { + width: 24px; + height: 24px; +} + .cbi-image-button { margin-left: .5rem; } diff --git a/themes/luci-theme-openwrt-2020/htdocs/luci-static/openwrt2020/cascade.css b/themes/luci-theme-openwrt-2020/htdocs/luci-static/openwrt2020/cascade.css index 5dcda6efc6..cd8fef6a27 100644 --- a/themes/luci-theme-openwrt-2020/htdocs/luci-static/openwrt2020/cascade.css +++ b/themes/luci-theme-openwrt-2020/htdocs/luci-static/openwrt2020/cascade.css @@ -704,6 +704,11 @@ p > a { white-space: nowrap; } +#cbi-network-interface .ifacebox img { + width: 24px; + height: 24px; +} + .ifacebadge { display: inline-flex; align-items: center; diff --git a/themes/luci-theme-openwrt/htdocs/luci-static/openwrt.org/cascade.css b/themes/luci-theme-openwrt/htdocs/luci-static/openwrt.org/cascade.css index 3f8235068e..34896af979 100644 --- a/themes/luci-theme-openwrt/htdocs/luci-static/openwrt.org/cascade.css +++ b/themes/luci-theme-openwrt/htdocs/luci-static/openwrt.org/cascade.css @@ -1653,6 +1653,11 @@ select + .cbi-button { min-width: 35%; } +#cbi-network-interface .ifacebox img { + width: 24px; + height: 24px; +} + .zonebadge { padding: 2px; -- 2.30.2